$(function () {

    if (JSON.parse(localStorage.getItem("users")) != null) {

        const u_id = JSON.parse(localStorage.getItem("users")).u_id

        // console.log(u_id)
        //链接ajax  让商品信息加入到数据库
        $.ajax({
            url: "./api/addcart",
            type: "get",
            data: { u_id }
        }).then(function (res) {
            // console.log(res.data)
            var N = res.data.length

            loadTab(res.data, N)
            ZJG()

            //点击减号后的时间
            $(".main-jian").on("click", function () {
                var p = $(this).next().text()
                p--
                if (p <= 1) {
                    p = 1
                }
                $(this).next().text(p)

                var s = $(this).parent().children(':last-child').text()

                $.ajax({
                    url: "./api/addcart2",
                    type: "get",
                    data: { u_id, s, p }  //用户的id  商品的id  商品的数量
                }).then(function (res) {
                    //修改数据后,再查询数据
                    $.ajax({
                        url: "./api/addcart3",
                        type: "get",
                        data: { u_id }  //用户的id  商品的id  商品的数量
                    }).then(function (res) {
                        // console.log(res.data)
                        var arr = res.data

                        var total = 0
                        // arr.forEach((el) => {
                        //     var s = Number(el.p_total)
                        //     total += s
                        // })
                        for (var i = 0; i < arr.length; i++) {
                            $(".main-zjg")[i].innerText = Number(arr[i].p_total)
                            var s = Number(arr[i].p_total)
                            total += s
                        }
                        $("#ZJ").text(total)
                    })
                })
            })


            //点击加号后的事件
            $(".main-jia").on("click", function () {
                var p = $(this).prev().text()
                p++
                $(this).prev().text(p)

                var s = $(this).parent().children(':last-child').text()

                $.ajax({
                    url: "./api/addcart2",
                    type: "get",
                    data: { u_id, s, p }  //用户的id  商品的id  商品的数量
                }).then(function (res) {
                    // console.log(res)

                    $.ajax({
                        url: "./api/addcart3",
                        type: "get",
                        data: { u_id }  //用户的id  商品的id  商品的数量
                    }).then(function (res) {
                        // console.log(res.data)
                        var arr = res.data

                        var total = 0
                        // arr.forEach((el) => {
                        //     var s = Number(el.p_total)
                        //     total += s
                        // })

                        // loadTab(arr)

                        for (var i = 0; i < arr.length; i++) {
                            $(".main-zjg")[i].innerText = Number(arr[i].p_total)
                            var s = Number(arr[i].p_total)
                            total += s
                        }
                        $("#ZJ").text(total)

                    })
                })
            })

            //点击商品本体后
            $(".main-sp").on("click", function () {
                var h = $(this).find("span").text()
                // console.log(h)


                var s = `http://127.0.0.5:8081/goods.html?id=${h}`

                window.open(s, "_blank")
            })

            //点击删除后
            $(".main-sc").on("click", function () {
                layer.tips("删除完成!", $(this), { tips: [1, 'rgba(0,0,0,0.7)'], time: 1500 })
            })

            //商品详细分类选中
            $(".QX1").on("click", function () {
                // console.log("456523")
                // console.log()
                var inp = $(this).parent().parent().next().find('div').eq(0).find("input")

                if ($(this).prop('checked')) {
                    inp.prop("checked", true)
                } else {
                    inp.prop("checked", false)
                }

                ZJG()
                Qxs()
            })



            //点单个商品选中事件
            $(".QX2").on("click", function () {
                ZJG()
                Qxs()
            })


            //点击单个商品删除按钮
            $(".main-sc").on("click", function () {
                var p_id = $(this).parent().parent().find("div").eq(2).find("span").text()
                $(this).parent().parent().parent().remove()
                // console.log(p_id)

                //修改数据库的内容
                $.ajax({
                    url: "./api/addcart4",
                    type: "get",
                    data: { u_id,p_id }
                }).then(function(res){
                    // console.log(res)
                })


                ZJG()
            })


        })


        function loadTab(arr, N) {
            var strHtml = ""
            var total = 0
            var n = 1
            arr.forEach((el) => {
                n++
                var s = Number(el.p_total)
                total += s
                strHtml += `
                <div class="main1-3-1">
                    <div class="main1-3-1-1">
                        <p><input class="QX QX1 QX3" type="checkbox" checked></p>
                        <p><span></span>百联自营</p>
                    </div>
                    <div class="main1-3-1-2">
                        <div><input class="QX QX2 QX3" type="checkbox" checked></div>
                        <div>
                            <img src="${el.p_img}" alt="">
                        </div>
                        <div class="main-sp">${el.p_name}<span class="ID">${el.p_id}</span></div>
                        <div>
                            <p>¥<span>${el.p_price}</span></p>
                            <p>抢购</p>
                        </div>
                        <div>
                            <p class="main-jian">-</p>
                            <p class="main-shu">${el.p_number}</p>
                            <p class="main-jia">+</p>
                            <span class="ID">${el.p_id}</span>
                        </div>
                        <div>¥<span class="main-zjg">${el.p_total}</span></div>
                        <div>
                            <p>移入收藏夹</p>
                            <p class="main-sc">删除</p>
                        </div>
                    </div>
                </div>
                `

                $(".main1-3").text("")
                $(".main1-3").append(strHtml)
                // console.log(total)
            })
            // console.log(total)
            // $("#ZJ").text(total)
            $(".SL").text(N)


        }


        //算总价
        function ZJG() {
            var h = 0
            $(".QX2").each((index, el) => {

                if ($(el).prop('checked')) {
                    h += Number($(el).parent().parent().find("div").eq(5).find("span").text())
                }
            })
            if (h == 0) {
                h = "0.00"
            }
            $("#ZJ").text(h)
        }

        //少一个的时候,全选消失
        function Qxs() {
            $(".QX3").each((index, el) => {
                if ($(el).prop('checked')) {
                    $(".main1-2 input").prop("checked", true)
                    $(".main1-4 input").prop("checked", true)
                } else {
                    $(".main1-2 input").prop("checked", false)
                    $(".main1-4 input").prop("checked", false)
                    return false;
                }
            })
        }





    } else {
        layer.msg('你个憨憨滚去登陆!');
    }




    //全选按钮点击事件
    $(".main1-2 input").on("click", function () {
        if ($(".main1-2 input").is(':checked')) {
            $(".QX").prop("checked", true)
        } else {
            $(".QX").prop("checked", false)
        }
        ZJG()
    })


    $(".main1-4 input").on("click", function () {
        if ($(".main1-4 input").is(':checked')) {
            $(".QX").prop("checked", true)
        } else {
            $(".QX").prop("checked", false)
        }
        ZJG()
    })





    //选中的才算价格
    //判断按钮是否被选中     


})